<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width"/>
    <title>电压监控分布</title>
    <link rel="stylesheet" type="text/css" href="../../leaflet/leaflet.css"/>
    <link rel="stylesheet" type="text/css" href="../../leaflet/leaflet.marker.highlight.css"/>
    <link rel="stylesheet" type="text/css" href="../../css/map.css"/>
    <script src="../../leaflet/leaflet.js"></script>
    <script src="../../leaflet/leaflet.marker.highlight.js"></script>
    <link rel="stylesheet" type="text/css" href="../../leaflet/leaflet.marker.highlight.css"/>
</head>
<body>
<div id="map"></div>
<script src="../../js/mapSource.js"></script>
<script src="../../js/lib/jquery-3.2.1.min.js"></script>
<script src="../../js/layer.js"></script>
<script src="../../js/common.js"></script>
<script>

    layerManager.setMap(map);
    layerManager.setBaseLayer(BaseLayers.getMapBoxUrl(), BaseLayers.getLayerDetails(0).id, BaseLayers.getToken());
    layerManager.addOverLayer(mapSource.Power.url, mapSource.Power.layer);
    layerManager.createOverLayer();
    map.fitBounds([[34.71385192871, 112.812599182129],
        [34.9339599609375, 114.135353088379]]);

    map.addEventListener('click', function (e) {
        var geomText = latlngToGeomText(e.latlng);
        var params = {
            geoText: geomText
        };
        $.get('http://19.16.71.127:8081/getPowerBySingleClick', params, function (data, status) {
            if (status == "success") {
                console.log(data);
                if (data.length > 0) {
                    console.log(data[0].geom);
                    var geom=JSON.parse(data[0].geom);
                    console.log(geom.coordinates);
                    addFlicker(geom.coordinates[1], geom.coordinates[0]);
                    flicker.bindPopup("编号："+data[0].smoke +"<br/>"
                    +data[0].company+"<br/>"
                    +data[0].address+"<br/>状态：<p style='color: green'>正常</p>"
                    ).openPopup();
                }
            }
        });
    });

    function latlngToGeomText(latlng) {
        var lat = latlng.lat;
        var lng = latlng.lng;
        var geomText = "POINT(" + lng + " " + lat + ")";
        return geomText;
    }

</script>
</body>
</html>